<template>
	<view class="indexBackground">
		<!-- 背景色区域 -->
		<view class="title-background" :style="{ backgroundColor: titleBackground }"></view>
	</view>
</template>

<script>	
	export default {
		name: 'indexBackground',
		props: {
			theme: {
				type: String,
				default: () => {
					return 'default';
				}
			}
		},
		computed: {
			titleBackground() {
				let color = '';
				switch(this.theme){
					case 'default': color = '#f7965e'; break;
					default: color = '#f7965e';
				}
				return color;
			},
		}
	}
</script>

<style lang="scss">
	.indexBackground {
		.title-background {
			position: absolute;
			z-index: 1;
			top: 0upx;
			left: 0;
			width: 100%;
			height: 400upx;
			transition: .4s;
			border-bottom-left-radius: 10upx;
			border-bottom-right-radius: 10upx;
		}
	}
</style>
